@-webkit-keyframes glue-out{
	40%{
		-moz-transform:rotateY(15deg);
		-ms-transform:rotateY(15deg);
		-webkit-transform:rotateY(15deg);
		transform:rotateY(15deg);
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
		opacity:0.8;
		-webkit-animation-timing-function:ease-out;
	}

	100%{
		-moz-transform:scale(0.8) translateZ(-200px);
		-ms-transform:scale(0.8) translateZ(-200px);
		-webkit-transform:scale(0.8) translateZ(-200px);
		transform:scale(0.8) translateZ(-200px);
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
		opacity:0;
	}

}

@-moz-keyframes glue-out{
	40%{
		-moz-transform:rotateY(15deg);
		-ms-transform:rotateY(15deg);
		-webkit-transform:rotateY(15deg);
		transform:rotateY(15deg);
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
		opacity:0.8;
		-webkit-animation-timing-function:ease-out;
	}

	100%{
		-moz-transform:scale(0.8) translateZ(-200px);
		-ms-transform:scale(0.8) translateZ(-200px);
		-webkit-transform:scale(0.8) translateZ(-200px);
		transform:scale(0.8) translateZ(-200px);
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
		opacity:0;
	}

}
@keyframes glue-out{
	40%{
		-moz-transform:rotateY(15deg);
		-ms-transform:rotateY(15deg);
		-webkit-transform:rotateY(15deg);
		transform:rotateY(15deg);
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
		opacity:0.8;
		-webkit-animation-timing-function:ease-out;
	}

	100%{
		-moz-transform:scale(0.8) translateZ(-200px);
		-ms-transform:scale(0.8) translateZ(-200px);
		-webkit-transform:scale(0.8) translateZ(-200px);
		transform:scale(0.8) translateZ(-200px);
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
		opacity:0;
	}

}

@-webkit-keyframes move-in{
	from{
		opacity:1;
		-moz-transform:translateX(100%);
		-ms-transform:translateX(100%);
		-webkit-transform:translateX(100%);
		transform:translateX(100%);
	}

}

@-moz-keyframes move-in{
	from{
		opacity:1;
		-moz-transform:translateX(100%);
		-ms-transform:translateX(100%);
		-webkit-transform:translateX(100%);
		transform:translateX(100%);
	}

}

@keyframes move-in{
	from{
		opacity:1;
		-moz-transform:translateX(100%);
		-ms-transform:translateX(100%);
		-webkit-transform:translateX(100%);
		transform:translateX(100%);
	}

}

.glue-out{
	-webkit-transform-origin:0% 50%;
	-moz-transform-origin:0% 50%;
	transform-origin:0% 50%;
	-webkit-animation-name:glue-out;
	-webkit-animation-duration:0.8s;
	-webkit-animation-iteration-count:1;
	-webkit-animation-timing-function:ease-in;
	-webkit-animation-delay:0;
	-webkit-animation-fill-mode:both;
	-moz-animation-name:glue-out;
	-moz-animation-duration:0.8s;
	-moz-animation-iteration-count:1;
	-moz-animation-timing-function:ease-in;
	-moz-animation-delay:0;
	-moz-animation-fill-mode:both;
	animation-name:glue-out;
	animation-duration:0.8s;
	animation-iteration-count:1;
	animation-timing-function:ease-in;
	animation-delay:0;
	animation-fill-mode:both;
}

.move-in{
	-webkit-animation-name:move-in;
	-webkit-animation-duration:0.6s;
	-webkit-animation-iteration-count:1;
	-webkit-animation-timing-function:ease;
	-webkit-animation-delay:0.2s;
	-webkit-animation-fill-mode:both;
	-moz-animation-name:move-in;
	-moz-animation-duration:0.6s;
	-moz-animation-iteration-count:1;
	-moz-animation-timing-function:ease;
	-moz-animation-delay:0.2s;
	-moz-animation-fill-mode:both;
	animation-name:move-in;
	animation-duration:0.6s;
	animation-iteration-count:1;
	animation-timing-function:ease;
	animation-delay:0.2s;
	animation-fill-mode:both;
	z-index:5;
}


.hm-summer {display:block;position:relative;background-color:#fff;width:100%}
.hm-summer .cnt{display:block;width:230px;margin-left:8%;padding-bottom:10px;background-color:#fff;margin-top:4%}
.hm-summer .cnt:before,.hm-summer .cnt:after{display:block;content:" ";margin:0;padding:0;clear:both;overflow:hidden}
.hm-summer p{display:block;line-height:25px;color:#7d7d7d;font-size:16px}
.hm-btnB{display:block;width:154px;height:33px;line-height:33px;text-align:center;color:#fff;font-size:12px;background-color:#9ba4b4;margin-top:10px}


.hm-banner{display:block;position:relative;width:100%;background:url(../images/hm-bg.jpg) repeat}
.hm-banner ul.banner-list{display:block;list-style:inside none;position:absolute;
    width:100%;
	-moz-perspective:800px;
	-webkit-perspective:800px;
	perspective:800px;
	overflow:hidden}
	
.hm-banner ul.banner-list li{display:block;position:absolute;width:100%;height:100%;
	-moz-transform:translate3d(0,0,0);
	-ms-transform:translate3d(0,0,0);
	-webkit-transform:translate3d(0,0,0);
	transform:translate3d(0,0,0);
	-moz-transform-style:preserve-3d;
	-webkit-transform-style:preserve-3d;
	transform-style:preserve-3d;
	-moz-backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	visibility:hidden;
	overflow:hidden;
	z-index:0;
}
.hm-banner ul.banner-list li.active{
	visibility:visible;
	z-index:1;
}


.hm-banner dl.group-dots{display:block;position:absolute;bottom:10px;left:45%;*height:15px;z-index:2}
.hm-banner dl.group-dots dt{display:block;margin-right:2px;cursor:pointer;float:left}
.hm-banner dl.group-dots .dot{display:block;width:15px;height:15px;background:url(../images/hm-dots.png) no-repeat;background-position:2px -38px}
.hm-banner dl.group-dots dt:hover .dot,.hm-banner dl.group-dots dt.active .dot{background:url(../images/hm-dots.png) no-repeat;background-position:2px 1px}


    .hm-H{top:52%;width:100%;left:0;position:absolute;font-family:Tahoma, "Microsoft YaHei", sans-serif, Arial, Helvetica}
	ul.hm-titleList{display:block;width:99%;left:1%;height:auto;list-style:inside none;position:relative;margin:0 auto;z-index:6}
	ul.hm-titleList li{display:block;visibility:hidden;width:100%;height:auto;position:absolute}
	ul.hm-titleList li:after,ul.hm-titleList li:before{display:block;clear:both;content:" ";height:0;line-height:0;margin:0;padding:0;overflow:hidden}
	ul.hm-titleList li.active{visibility:visible}
	.hm-ht{display:block;margin-bottom:2px;line-height:normal;position:relative}
	.hm-ht .t-bg{display:block;float:left;overflow:hidden;position:relative}
	.hm-ht strong{display:block;margin:4px 10px;font-weight:normal;white-space:nowrap;overflow:hidden;position:relative}
	.hm-ht.ht1{padding-left:25px}
	.hm-ht.ht2{padding-left:0}
	.hm-ht.ht3{padding-left:50px}
	.hm-ht.ht1 .t-bg{background-color:#e75861;color:#fff}
	.hm-ht.ht2 .t-bg{background-color:#df202c;color:#fff}
	.hm-ht.ht3 .t-bg{background-color:#e75861;color:#fff}
    .hm-ht .ph{z-index:0;float:left;display:block;width:10px;height:10px;background-color:red}
    .hm-ht.ht1 .t-bg{font-size:20px;line-height:20px;height:28px!important}
    .hm-ht.ht2 .t-bg{font-size:30px;line-height:30px;height:38px!important}
	.hm-ht.ht3 .t-bg{font-size:20px;line-height:20px;height:26px!important}
	
	.hm-pageCnt{display:block;position:relative}


@media only screen and (min-width: 360px){
	 ul.hm-titleList{width:95%;margin:0 auto}
	 .hm-summer .cnt{margin-top:10%}
	}


@media only screen and (min-width: 480px) {
	   .hm-summer .cnt{width:90%;left:5%;padding:10px 0;margin-top:0}
	   .hm-summer:after,.hm-summer:before{content:" ";clear:both;height:0;line-height:0;overflow:hidden}
	   .hm-summer p{float:left}
	   .hm-summer .hm-btnB{float:right}
	    ul.hm-titleList{width:90%;margin:0 auto}
	   .hm-ht.ht1 .t-bg{font-size:30px;line-height:30px;height:38px!important}
       .hm-ht.ht2 .t-bg{font-size:40px;line-height:40px;height:48px!important}
	   .hm-ht.ht3 .t-bg{font-size:30px;line-height:30px;height:38px!important}  
	}
@media only screen and (min-width: 481px){
	   ul.hm-titleList{width:75%;margin:0 auto}
	   .hm-summer .cnt{margin-top:5%}
	}
@media only screen and (width: 768px) {
	   ul.hm-titleList{width:90%;margin:0 auto}	
	}
@media only screen and (min-width: 769px){
	   .hm-H{top:32%;width:auto;left:-30%}
	   .hm-ht strong{margin:5px 10px;}
	   .hm-ht.ht1 .t-bg{font-size:30px;height:40px!important}
       .hm-ht.ht2 .t-bg{font-size:49px;height:59px!important}
	   .hm-ht.ht3 .t-bg{font-size:24px;height:34px!important}
	   .hm-summer {position:absolute;height:120px;bottom:15px;width:250px;left:-252px}
       .hm-summer .cnt{display:block;margin-left:2%;background-color:#fff}
	   .hm-summer .hm-btnB{float:left}
	   .hm-ht strong{padding-top:5px}
	}

@media only screen and (min-width: 980px) {   
       .hm-H{top:32%;width:auto;left:-25%}
	   .hm-ht.ht1 .t-bg{font-size:40px;line-height:40px;height:50px!important}
       .hm-ht.ht2 .t-bg{font-size:59px;line-height:59px;height:69px!important}
	   .hm-ht.ht3 .t-bg{font-size:34px;line-height:34px;height:44px!important}
       .hm-banner dl.group-dots{bottom:25px;left:30px}
	   .hm-ht strong{padding-top:0px}
	}
@media only screen and (min-width: 1480px) {
      .hm-H{top:32%;width:auto;left:-35%}  
}